﻿<<template>
  <div calss="table">
    <!--表2季度生产情况T_MulQuartProduc-->
    <div class="divSearch">
      <Row>
        <Col span="24" class="col-margin"> 
          <label class="searchLabel">所属地区:</label>
          <!-- <Cascader :data="AreaList" change-on-select @on-change='SearchCascaderChange'  class="searchInput"></Cascader>-->
          <Select v-model="searchModel.AreaCode"  placeholder="请选择..." style="width: 100px" @on-change="getPageData()" class="searchInput">
               <Option :value="userinfo.AreaCode" v-if="userinfo.AreaCode=='530000000000'">全&nbsp;&nbsp;省</Option>
              <Option :value="userinfo.AreaCode" v-else>全市/州</Option>
              <Option :value="item.value" v-for="item in AreaList" :key="item.value">{{item.label}}</Option>
          </Select>
          填报年度：
          <Select v-model="searchModel.FillInYear" placeholder="全部" style="width: 100px" @on-change="getPageData()">
              <Option value="">全部</Option>
              <Option :value="item.DictText" v-for="item in CreateYearList" :key="item.DictText">{{item.DictText}}</Option>
          </Select>
          报表状态：
          <Select v-show="this.userinfo.AreaCode=='530000000000'&&this.userinfo.Account=='530000'" v-model="searchModel.StatusTwo" placeholder="全部" style="width: 100px" @on-change="getPageData()">
              <Option value="">全部</Option>
              <Option :value="item.DictValue" v-for="item in ReStatusList" :key="item.DictValue">{{item.DictText}}</Option>
          </Select>
          <Select v-show="this.userinfo.Account!='530000'" v-model="searchModel.Status" placeholder="全部" style="width: 100px" @on-change="getPageData()">
              <Option value="">全部</Option>
              <Option :value="item.DictValue" v-for="item in ReStatusList" :key="item.DictValue">{{item.DictText}}</Option>
          </Select>
          <Button icon="ios-search" type="ghost" @click="getPageData()" style="margin-left: 5px;background: linear-gradient(to bottom, #64c8ef 0%,#00a2e2 100%);color: #fff;border-radius: 3px;text-shadow: 1px 1px 0px rgba(0, 0, 0, 0.3);">
            查询
          </Button>
        </Col>
      </Row>
    </div>
    <Row>
      <Col span="24" class="col-margin">
      <Table size="small" :height="clientHeight" border="" :context="ctx" :columns="columnsList" :data="datas.rows" no-data-text='暂无数据...'></Table>
      </Col>
    </Row>
    <Row>
      <Col span="24" class="dataTable">
      <Page style="float:right;margin: 5px 20px 5px 0;" class="page-style" :total="datas.total" placement="top" @on-change="getPageNumber" :page-size="searchModel.PageSize" :page-size-opts='pageSizeOpts' show-sizer='' @on-page-size-change="getPageSize" show-total="" show-elevator=""></Page>
      </Col>
    </Row>
    <Modal v-model="showType" :mask-closable="false" width='1200'>
      <p slot="header" class="title">
        <Icon type="ios-paper" size="20"></Icon>
        <span style="font-size: 20px">{{CurrentTableName}}</span>
      </p>
      <p slot="close">
        <Icon type="close-circled" color="red" size="25"></Icon>
      </p>
      <table class="reptable" style="width:100%">
        <tr>
          <th colspan="2">桑枝菌</th>
          <th colspan="2">桑叶茶</th>
          <th colspan="2">桑果、汁、酒</th>
          <th colspan="2">蚕沙提取叶绿素</th>
          <th colspan="2">蚕沙肥料</th>
          <th colspan="2">食用蛹、蛾</th>
          <th colspan="2">蚕蛾酒</th>
          <th colspan="2">其它</th>
        </tr>
        <tr>
          <th style="width:75px;">重量
            <br />（吨）</th>
          <th style="width:75px;">产值
            <br />（万元）</th>
          <th style="width:75px;">重量
            <br />（吨）</th>
          <th style="width:75px;">产值
            <br />（万元）</th>
          <th style="width:75px;">重量
            <br />（吨）</th>
          <th style="width:75px;">产值
            <br />（万元）</th>
          <th style="width:75px;">重量
            <br />（吨）</th>
          <th style="width:75px;">产值
            <br />（万元）</th>
          <th style="width:75px;">重量
            <br />（吨）</th>
          <th style="width:75px;">产值
            <br />（万元）</th>
          <th style="width:75px;">重量
            <br />（吨）</th>
          <th style="width:75px;">产值
            <br />（万元）</th>
          <th style="width:75px;">重量
            <br />（吨）</th>
          <th style="width:75px;">产值
            <br />（万元）</th>
          <th style="width:75px;">重量
            <br />（吨）</th>
          <th style="width:75px;">产值
            <br />（万元）</th>
        </tr>
        <tr style="height:40px;">
          <td style="text-align:center;padding: 4px 7px;">
            {{dataModel.MulFunWeight|decimal|formatCurrency}}
          </td>
          <td style="text-align:center;padding: 4px 7px;">
            {{dataModel.MulFunValue|decimal|formatCurrency}}
          </td>
          <td style="text-align:center;padding: 4px 7px;">
            {{dataModel.MulTeaWeight|decimal|formatCurrency}}
          </td>
          <td style="text-align:center;padding: 4px 7px;">
            {{dataModel.MulTeaValue|decimal|formatCurrency}}
          </td>
          <td style="text-align:center;padding: 4px 7px;">
            {{dataModel.MulFruitWeight|decimal|formatCurrency}}
          </td>
          <td style="text-align:center;padding: 4px 7px;">
            {{dataModel.MulFruitValue|decimal|formatCurrency}}
          </td>
          <td style="text-align:center;padding: 4px 7px;">
            {{dataModel.MulExcreWeight|decimal|formatCurrency}}
          </td>
          <td style="text-align:center;padding: 4px 7px;">
            {{dataModel.MulExcreValue|decimal|formatCurrency}}
          </td>
          <td style="text-align:center;padding: 4px 7px;">
            {{dataModel.MulFertWeight|decimal|formatCurrency}}
          </td>
          <td style="text-align:center;padding: 4px 7px;">
            {{dataModel.MulFertValue|decimal|formatCurrency}}
          </td>
          <td style="text-align:center;padding: 4px 7px;">
            {{dataModel.MulPupaeWeight|decimal|formatCurrency}}
          </td>
          <td style="text-align:center;padding: 4px 7px;">
            {{dataModel.MulPupaeValue|decimal|formatCurrency}}
          </td>
          <td style="text-align:center;padding: 4px 7px;">
            {{dataModel.MulWineWeight|decimal|formatCurrency}}
          </td>
          <td style="text-align:center;padding: 4px 7px;">
            {{dataModel.MulWineValue|decimal|formatCurrency}}
          </td>
          <td style="text-align:center;padding: 4px 7px;">
            {{dataModel.OtherWeight|decimal|formatCurrency}}
          </td>
          <td style="text-align:center;padding: 4px 7px;">
            {{dataModel.OtherValue|decimal|formatCurrency}}
          </td>
        </tr>
      </table>
      <div slot="footer">
          <div style="text-align:right;padding-top:5px;">
          <Button type="primary" @click="saveSure()">审核通过</Button>
          <Button type="warning" @click="saveUnSure()">审核不通过</Button>
          </div>
          <Alert style="margin-top:5px;text-align:left;font-size:14px;" banner type="error">
          备注：若没有表格中的利用情况，请在对应位置填0；有表格中未统计的利用情况，可在“其他”一列中填入；
          <span slot="desc">
          </span>
          </Alert>
      </div>
    </Modal>
    <Modal v-model="ViewShow" :mask-closable="false" width="1200">
      <p slot="header" class="title">
        <Icon type="ios-paper" size="20"></Icon>
        <span style="font-size: 20px">{{CurrentTableName}}</span>
      </p>
      <p slot="close">
        <Icon type="close-circled" color="red" size="25"></Icon>
      </p>
      <table class="reptable" style="width:100%">
        <tr>
          <th colspan="2">桑枝菌</th>
          <th colspan="2">桑叶茶</th>
          <th colspan="2">桑果、汁、酒</th>
          <th colspan="2">蚕沙提取叶绿素</th>
          <th colspan="2">蚕沙肥料</th>
          <th colspan="2">食用蛹、蛾</th>
          <th colspan="2">蚕蛾酒</th>
          <th colspan="2">其它</th>
        </tr>
        <tr>
          <th style="width:75px;">重量
            <br />（吨）</th>
          <th style="width:75px;">产值
            <br />（万元）</th>
          <th style="width:75px;">重量
            <br />（吨）</th>
          <th style="width:75px;">产值
            <br />（万元）</th>
          <th style="width:75px;">重量
            <br />（吨）</th>
          <th style="width:75px;">产值
            <br />（万元）</th>
          <th style="width:75px;">重量
            <br />（吨）</th>
          <th style="width:75px;">产值
            <br />（万元）</th>
          <th style="width:75px;">重量
            <br />（吨）</th>
          <th style="width:75px;">产值
            <br />（万元）</th>
          <th style="width:75px;">重量
            <br />（吨）</th>
          <th style="width:75px;">产值
            <br />（万元）</th>
          <th style="width:75px;">重量
            <br />（吨）</th>
          <th style="width:75px;">产值
            <br />（万元）</th>
          <th style="width:75px;">重量
            <br />（吨）</th>
          <th style="width:75px;">产值
            <br />（万元）</th>
        </tr>
        <tr style="height:40px;">
          <td style="text-align:center;padding: 4px 7px;">
            {{dataModel.MulFunWeight|decimal|formatCurrency}}
          </td>
          <td style="text-align:center;padding: 4px 7px;">
            {{dataModel.MulFunValue|decimal|formatCurrency}}
          </td>
          <td style="text-align:center;padding: 4px 7px;">
            {{dataModel.MulTeaWeight|decimal|formatCurrency}}
          </td>
          <td style="text-align:center;padding: 4px 7px;">
            {{dataModel.MulTeaValue|decimal|formatCurrency}}
          </td>
          <td style="text-align:center;padding: 4px 7px;">
            {{dataModel.MulFruitWeight|decimal|formatCurrency}}
          </td>
          <td style="text-align:center;padding: 4px 7px;">
            {{dataModel.MulFruitValue|decimal|formatCurrency}}
          </td>
          <td style="text-align:center;padding: 4px 7px;">
            {{dataModel.MulExcreWeight|decimal|formatCurrency}}
          </td>
          <td style="text-align:center;padding: 4px 7px;">
            {{dataModel.MulExcreValue|decimal|formatCurrency}}
          </td>
          <td style="text-align:center;padding: 4px 7px;">
            {{dataModel.MulFertWeight|decimal|formatCurrency}}
          </td>
          <td style="text-align:center;padding: 4px 7px;">
            {{dataModel.MulFertValue|decimal|formatCurrency}}
          </td>
          <td style="text-align:center;padding: 4px 7px;">
            {{dataModel.MulPupaeWeight|decimal|formatCurrency}}
          </td>
          <td style="text-align:center;padding: 4px 7px;">
            {{dataModel.MulPupaeValue|decimal|formatCurrency}}
          </td>
          <td style="text-align:center;padding: 4px 7px;">
            {{dataModel.MulWineWeight|decimal|formatCurrency}}
          </td>
          <td style="text-align:center;padding: 4px 7px;">
            {{dataModel.MulWineValue|decimal|formatCurrency}}
          </td>
          <td style="text-align:center;padding: 4px 7px;">
            {{dataModel.OtherWeight|decimal|formatCurrency}}
          </td>
          <td style="text-align:center;padding: 4px 7px;">
            {{dataModel.OtherValue|decimal|formatCurrency}}
          </td>
        </tr>
      </table>
      <div slot="footer">
        <Alert style="margin-top:5px;text-align:left;font-size:14px;" banner type="error">
          备注:若没有表格中的利用情况，请在对应位置填0；有表格中未统计的利用情况，可在“其他”一列中填入；
        </Alert>
      </div>
    </Modal>
    <Modal v-model="showAudit" :mask-closable="false" width="500">
      <p slot="header" class="title">
          <Icon type="ios-paper" size="20"></Icon>
          <span style="font-size: 20px">审核不通过原因</span>
      </p>
      <p slot="close">
          <Icon type="close-circled" color="red" size=25></Icon>
      </p>
      <Input v-model="strMsg" type="textarea" :rows="4" placeholder="请输入不通过原因..."></Input>
      <div slot="footer">
          <Button type="primary" @click="sureUnSure()">确定</Button>
          <Button type="ghost" @click="cancelUnSure()" style="margin-left: 8px">取消</Button>
      </div>
  </Modal>
  </div>
</template>
<script>
export default {
  data() {
    const validateNumber = (rule, value, callback) => {
      if (!Number.isInteger(value)) {
        callback(new Error('请输入数字值'));
      } else {
        if (value < 18) {
          callback(new Error('必须年满18岁'));
        } else {
          callback();
        }
      }
    };
    return {
      showAudit: false,
      strMsg: '',
      Id: '',
      AreaList: [],
      CurrentTableName:'表5蚕桑综合利用情况',
      CurrentYear: this.GetCurrentYear(),//当前年度
      userinfo: this.GetlocaStorage("CSuserinfo"),
      datas: {}, //table数据对象
      dataIds: [],
      TableCodeList: this.GetGroupDict("ReportTableName"), //表名称
      CreateYearList: this.GetGroupDict("ReportYear"), //上报年份
      CycleList: this.GetGroupDict("ReportCycle"), //周期
      ReStatusList:this.GetGroupDict("ReportStatus"),//报表状态
      pageSizeOpts: [20, 40, 50], //默认分页最大设置
      showType: false, //编辑框弹出状态
      ViewShow: false,
      selectTabName: '',
      TabTitleList: [], //tab选项卡列表
      //查询模型：根据需求删除不不要查询条件
      searchModel: {
        ReportCode: 'MulComplexQuest',
        FillInYear: '',
        TimesType: '',
        AreaCode: this.GetlocaStorage("CSuserinfo").AreaCode,
        Status:'',
        StatusTwo:'3',
        PageNumber: 1,
        PageSize: 20
      },
      dataModel: { //编辑模型
        Id: 0,
        ReportId: '',
        SeedSize: '',
        FreshCocoonYield: '',
        AveFreshCocoon: '',
        SmallRearSilk: '',
        NextSeaOutPut: '',
        NextSeaFresh: '',
      },
      ctx: this, //table数据上下文
      columnsList: [{ title: "报表名称", key: "ReportName", },
      // { title: "填报年度", key: "FillInYearName", },
      // { title: "属行政区划", key: "AreaCodeName",  },
      // { title: "填报周期", key: "TimesTypeName", },
      {
        title: "报表状态", key: "StatusName", 
        width:150,
        render: (h, params) => {
          switch (params.row.Status * 1) {
            case 0: //审核未通过
              return h('span', { class: { Error: true } }, params.row.StatusName);
            case 1: //未填写
              return h('span', { class: { NoReport: true } }, params.row.StatusName);
            case 2: //已填写
              return h('span', { class: { AlreadyReport: true } }, params.row.StatusName);
            case 3: //已上报
              return h('span', { class: { UpReport: true } }, params.row.StatusName);
            case 4: //审核通过
              return h('span', { class: { Success: true } }, params.row.StatusName);
            case 5: //锁定
              return h('span', { class: { error: true } }, params.row.StatusName);
            default:
              return h('span', { class: { Default: true } }, params.row.StatusName);
          }
        }
      },
      { title: "新增时间", key: "StrAddTime", width:180},
      // { title: "填报时间", key: "StrUpdateTime", },
      {
        title: "操作", key: "Id", width: 260, align: 'center',
        render: (h, params) => {
          return h('div', [
            h('Button', {
              class: { ieditColor: true },
              props: {
                type: 'ghost', size: 'small', icon: 'ios-paper-outline'
              },
              style: {
                marginRight: '5px'
              },
              on: {
                click: () => {
                  this.showInfo(params.row.Id, params.row.ReportCode, params.row.ReportName)
                }
              }
            }, '查看'),
            h('Button', {
              class: { irefreshColor: true },
              props: {
                type: 'ghost', size: 'small', icon: 'network', disabled: params.row.Status == 4 || params.row.Status<3
              },
              style: {
                marginRight: '5px'
              },
              on: {
                click: () => {
                  this.editInfo(params.row.Id, params.row.ReportCode, params.row.ReportName)
                }
              }
            }, '审核'),
            h('Button', {
              class: { ideleteColor: true },
              props: {
                type: 'ghost', size: 'small', icon: 'ios-undo',disabled: params.row.Status < 4
              },
              style: {
                marginRight: '5px'
              },
              on: {
                click: () => {
                  this.unReview(params.row.Id)
                }
              },
              directives: [
                {
                  name: 'omg-operation',
                  value: { op: "unreview" }
                }
              ]
            }, '取消审核'),
          ])
        }
      }
      ],
      clientHeight: window.innerHeight - 260, //表格默认高度
    }
  },
  mounted() {
    //table高度计算方法
    const that = this;
    window.onresize = () => {
      return (() => {
        that.clientHeight = window.innerHeight - 260;
      })()
    };
  },
  methods: {
  //获取当前地区包含区(县)市(州)
    SearchAreaList() {
        var areaCode = this.userinfo.AreaCode;
        var areaList=[];
        if (areaCode != '530000000000' && areaCode != null) {
            var item = this.GetlocaStorage("areatreelist")[0];
            for (var i = 0; i < item.children.length; i++) {
                if (item.children[i].value == areaCode) {
                    areaList.push(item.children[i]);
                }
            }
        } else {

            areaList = this.GetlocaStorage("areatreelist");
        }
        this.AreaList=areaList[0].children;
    },
    upReport(id) {
      var self = this;
      self.$Modal.confirm({
        title: '提示信息',
        content: '<p>是否确认上报？</p>',
        onOk: () => {
          var model = new Object();
          model.Id = id;
          model.reportType = '3';
          model.strMsg = '';
          this.$http.post("Report/PostUpStatus", model).then(
            function (res) {
              if (res.data.status == 1) {
                self.$Notice.success({
                  title: '已上报！',
                  desc: false
                });
                self.getPageData();
              } else {
                self.$Modal.error({
                  title: "提示信息",
                  content: "数据删除失败!!!"
                });
              }
            }
          );
        }
      });
    },
    getTab(name) {
      this.selectTabName = name;
    },
    //查看报表
    showInfo(id, reportCode,reportName) {
      var self = this;
      self.CurrentTableName=reportName;
      this.$http.get("Report", {
        params: {
          id: id,
          reportCode: reportCode
        }
      }).then( //获取数据编辑项的值
        function (res) {
          switch (res.data.list.status) {
            case 1:
              self.dataModel = res.data.list.model;
              self.ViewShow = true;
              break;
            case 0:
              self.$Modal.error({
                title: "提示信息",
                content: "编辑数据加载失败!!!"
              });
              break;
            case -1:
              self.$Modal.error({
                title: "提示信息",
                content: "编辑数据加载失败!!!"
              });
              break;
          }
        }
        );
    },
    //获取当前页码
    getPageNumber(pageIndex) {
      this.searchModel.PageNumber = pageIndex;
      this.getPageData();
    },
    //获取当前分页大小
    getPageSize(pageSize) {
      this.searchModel.PageSize = pageSize;
      this.getPageData();
    },
    //获取this.datas: {},//table数据对象
    getPageData() {
      var self = this;
      //判断是否为省级用户
      if(self.userinfo.AreaCode=="530000000000"&&self.userinfo.Account =="530000"){
          self.searchModel.Status = self.searchModel.StatusTwo;
      }else{
          self.searchModel.Status = self.searchModel.Status;
      }
      if (self.searchModel.FillInYear != null && self.searchModel.FillInYear != '') {
          self.searchModel.FillInYear = self.searchModel.FillInYear;//获取当前系统年份
      } else {
          self.searchModel.FillInYear = self.CurrentYear + '年'; //获取填报年度-----数据字典值
      }
      self.$http.post('Report/PostReviewPageList', this.searchModel).then(function (res) {
        if (res.data.status === 1) {
          self.datas = res.data;
        }
        else {
          self.$Modal.error({ title: '提示信息', content: res.data.message });
        }
      });
    },
    //编辑获取对象传入id
    editInfo(id, reportCode,reportName) { //编辑
      var self = this;
       self.CurrentTableName=reportName;
      this.Id = id;
      this.$http.get("Report", {
        params: {
          id: id,
          reportCode: reportCode
        }
      }).then( //获取数据编辑项的值
        function (res) {
          switch (res.data.list.status) {
            case 1:
              self.dataModel = res.data.list.model;
              self.modalShow();
              break;
            case 0:
              self.$Modal.error({
                title: "提示信息",
                content: "编辑数据加载失败!!!"
              });
              break;
            case -1:
              self.$Modal.error({
                title: "提示信息",
                content: "编辑数据加载失败!!!"
              });
              break;
          }
        }
        );
    },
    checkItem(datas, ItemCode) {
      var res = false;
      for (var i = 0; i < datas.length; i++) {
        if (datas[i].ItemCode == ItemCode) {
          res = true;
        }
      }
      return res;
    },
    //审核
    save(model) {
      var self = this;
      this.$http.post("Report/PostUpStatus", model).then(
        function (res) {
          if (res.data.status == 1) {
            self.$Notice.success({ title: '审核完成!', desc: false });
            self.getPageData();
            self.strMsg = '';
            self.modalHide();
          }
          else {
            self.$Modal.error({ title: "提示信息", content: "数据审核失败!!!" });
          }
        });
    },
    saveSure() {
      var model = new Object();
      model.Id = this.Id;
      model.reportType = '4';
      model.strMsg = '';
      this.save(model);
      this.modalHide();
    },
    //审核未通过
    saveUnSure() {
      var self = this;
      this.showAudit = true;
    },
    sureUnSure() {
      var self = this;
      this.showAudit = false;
      var model = new Object();
      model.Id = self.Id;
      model.reportType = '0';
      model.strMsg = this.strMsg;
      this.save(model);
    },
    cancelUnSure() {
      this.showAudit = false;
      //this.modalHide();
      this.strMsg = '';
    },
    //省级取消审核
    unReview(id, reportCode) {
      var model = new Object();
      model.Id = id;
      model.reportType = '0';
      model.strMsg = '省级已取消审核!';
      this.save(model);
    },
    //编辑框打开
    modalShow() {
      this.showType = true;
    },
    //编辑框关闭
    modalHide() {
      this.showType = false;
    },
    //取消方法
    cancel() {
      this.showType = false; //关闭modal
      this.TabTitleList = [];
    },
    //重置model
    restModel(modelname) {
      this.$refs[modelname].resetFields(); //重置model
    },
    //查询行政区划级联选择
    SearchCascaderChange(value, selectedData) {
      const index = value.length - 1;
      this.searchModel.AreaCode = value[index];
    },
  },
  //创建Vue页面方法
  created: function () {
    //创业Vue前调用获取this.datas: {},//table数据对象
    this.getPageData();
    this.SearchAreaList();
  },
  watch: {
    //需要监听的在此处新增监听对象
  }
}
</script>
